<template>
  <div>
    <div style="height:80px">
      <el-form :inline="true" class="demo-form-inline">
      <el-form-item>
        <el-input v-model="map.findid" placeholder="回访编号"></el-input>
      </el-form-item>
      <el-form-item>
        <el-input v-model="map.findreid" placeholder="体检结果编号"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="seldiaryall()">查询</el-button>
      </el-form-item>
      <el-form-item>
        <el-button type="warning" @click="selresultall() ; visible = true">新增回访日志</el-button>
      </el-form-item>
    </el-form>
    </div>
    <div>
      <el-table
        :data="page.rows"
        border
        style="width: 100%">
          <el-table-column
            prop="reDiaryId"
            label="回访编号"
            width="160"
            align="center">
          </el-table-column>
          <el-table-column
            prop="result.besResultName"
            label="被回访人"
            width="190"
            align="center">
          </el-table-column>
          <el-table-column
            prop="manager.hmName"
            label="回访人员"
            width="190"
            align="center">
          </el-table-column>
          <el-table-column
            prop="reDiaryWay"
            label="回访方式"
            width="220"
            align="center">
          </el-table-column>
          <el-table-column
            prop="reDiaryTime"
            label="回访日期"
            width="250"
            align="center">
          </el-table-column>
          <el-table-column
          label="操作"
          width="218"
          align="center"
          prop="reDiaryId">
          <template slot-scope="scope">
            <el-button type="text" @click="seldiaryone(scope.row.reDiaryId)">编辑</el-button>
            <el-button type="text" @click="deldiary(scope.row.reDiaryId)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <div class="block">
      <el-pagination
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :current-page="currentPage"
                :page-sizes="[3, 5, 9, 15]"
                :page-size="pageSize"
                layout="total, sizes, prev, pager, next, jumper"
                :total="page.total">
        </el-pagination>
    </div>

    <el-dialog
      title="回访信息"
      :visible.sync="visible"
      width="70%"
      center
      :before-close="cleardiary">
      <el-row>
        <el-col :span="12">
          <div>
            <el-form :model="diary" :rules="rules" ref="diary"
                      label-width="100px" class="demo-ruleForm"
                      label-position="left" inline-message>
              <el-form-item label="编号" prop="reDiaryId" hidden>
                <el-input v-model="diary.reDiaryId" style="width: 250px"></el-input>
                </el-form-item>
                <el-form-item label="回访日期时间" prop="reDiaryTime">
                    <!-- <el-date-picker
                      v-model="diary.reDiaryTime"
                      type="datetime"
                      placeholder="选择日期时间">
                    </el-date-picker> -->
                    <el-date-picker
                      v-model="diary.reDiaryTime"
                      type="datetime"
                      placeholder="选择日期时间"
                      align="right"
                      format="yyyy 年 MM 月 dd 日 HH 时 mm 分 ss 秒"
                      value-format="yyyy-MM-dd HH:mm:ss"
                      :picker-options="pickerOptions"
                      style="width:300px">
                    </el-date-picker>
                </el-form-item>
                <el-form-item label="回访方式" prop="reDiaryWay">
                  <el-select v-model="diary.reDiaryWay" placeholder="请选择回访方式" style="width: 250px">
                    <el-option label="电话回访" value="电话回访"></el-option>
                    <el-option label="短信回访" value="短信回访"></el-option>
                    <el-option label="邮件回访" value="邮件回访"></el-option>
                    <el-option label="会面回访" value="会面回访"></el-option>
                </el-select>
                </el-form-item>
                <el-form-item label="回访内容" prop="reDiaryContent">
                  <el-input type="textarea" v-model="diary.reDiaryContent" style="width: 250px"></el-input>
                </el-form-item>
                <el-form-item label="反馈信息" prop="reDiaryFeedback">
                  <el-input type="textarea" v-model="diary.reDiaryFeedback" style="width: 300px"></el-input>
                </el-form-item>
                <el-form-item label="处理结果" prop="reDiaryResult">
                  <el-input type="textarea" v-model="diary.reDiaryResult" style="width: 300px"></el-input>
                </el-form-item>
              </el-form>
          </div>
        </el-col>
        <el-col :span="12">
          <div>
                  <el-input v-model="diary.besResultId" style="width: 300px" readonly="readonly" placeholder="被访人会员编号"></el-input>
              <el-table
                ref="singleTable"
                :data="results"
                highlight-current-row
                @current-change="diaryreid"
                style="width: 100%"
                height="250px">
                <el-table-column
                  type="index"
                  width="50">
                </el-table-column>
                <el-table-column
                  prop="besResultId"
                  label="编号">
                </el-table-column>
                <el-table-column
                  prop="besResultName"
                  label="姓名">
                </el-table-column>
                <el-table-column
                  prop="besResultAge"
                  label="性别">
                </el-table-column>
                <el-table-column
                  prop="besResultAge"
                  label="年龄">
                </el-table-column>
              </el-table>
            </div>
          </el-col>
      </el-row>
      <span slot="footer" class="dialog-footer">
        <el-button @click="cleardiary()">取 消</el-button>
        <el-button type="primary" @click="subdiary()">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import axios from 'axios'

export default ({
  data () {
    return {
      visible: false,
      map: {
        index: '',
        findid: '',
        findreid: ''
      },
      page: {},
      currentPage: 1,
      pageSize: 5,
      diary: {
        reDiaryId: '',
        reDiaryTime: '',
        reDiaryWay: '',
        reDiaryContent: '',
        reDiaryFeedback: '',
        reDiaryResult: '',
        hmId: '',
        besResultId: '',
        manager: {},
        result: {}
      },
      results: [],
      rules: {
        reDiaryContent: [
          { required: true, message: '请填写回访内容', trigger: 'blur' }
        ],
        reDiaryWay: [
          { required: true, message: '请选择回访方式', trigger: 'change' }
        ],
        reDiaryTime: [
          { required: true, message: '请选择回访日期时间', trigger: 'change' }
        ],
        reDiaryFeedback: [
          { required: true, message: '请填写反馈信息', trigger: 'blur' }
        ],
        reDiaryResult: [
          { required: true, message: '请填写处理结果', trigger: 'blur' }
        ]
      },
      pickerOptions: {
        disabledDate (time) {
          return time.getTime() > Date.now()
        }
      }
    }
  },
  methods: {
    // 改变页大小
    handleSizeChange (value) {
      this.pageSize = value
      this.seldiaryall()
    },
    // 改变当前页码
    handleCurrentChange (value) {
      this.currentPage = value
      this.seldiaryall()
    },
    seldiaryall () {
      this.map.index = this.currentPage
      this.map.pageSize = this.pageSize
      axios.post('/api/diary/seldiaryall', this.map).then(result => {
        this.page = result.data
      })
    },
    selresultall () {
      axios.post('/api/diary/selresultall').then(result => {
        this.results = result.data
      })
    },
    seldiaryone (id) {
      axios.get('/api/diary/seldiaryone/' + id).then(result => {
        this.diary = result.data
      })
      this.selresultall()
      this.visible = true
    },
    diaryreid (val) {
      this.diary.besResultId = val.besResultId
    },
    deldiary (id) {
      axios.get('/api/diary/deldiary/' + id).then(result => {
        if (result.data) {
          this.$message({
            message: '删除成功',
            type: 'success'
          })
        } else {
          this.$message.error('删除失败，请稍后重试')
        }
        this.seldiaryall()
      })
    },
    subdiary () {
      // console.log(this.diary)
      this.$refs.diary.validate((valid) => {
        if (valid) {
          if (this.diary.besResultId === '') {
            this.$message.error('请在表格中选择回访人')
          } else {
            if (this.diary.reDiaryId === '') {
              let user = JSON.parse(sessionStorage.getItem('user'))
              this.diary.hmId = user.hmId
              axios.post('/api/diary/adddiary', this.diary).then(result => {
                if (result.data) {
                  this.$message({
                    message: '新增成功',
                    type: 'success'
                  })
                } else {
                  this.$message.error('新增失败，请稍后重试')
                }
                this.cleardiary()
                this.seldiaryall()
              })
            } else {
              axios.post('/api/diary/updiary', this.diary).then(result => {
                if (result.data) {
                  this.$message({
                    message: '编辑成功',
                    type: 'success'
                  })
                } else {
                  this.$message.error('编辑失败，请稍后重试')
                }
                this.cleardiary()
                this.seldiaryall()
              })
            }
          }
        }
      })
    },
    cleardiary (diary) {
      this.$refs.diary.resetFields()
      this.diary = {
        reDiaryId: '',
        reDiaryTime: '',
        reDiaryWay: '',
        reDiaryContent: '',
        reDiaryFeedback: '',
        reDiaryResult: '',
        hmId: '',
        besResultId: '',
        manager: {},
        result: {}
      }
      this.visible = false
    }
  },
  created () {
    this.seldiaryall()
  }
})
</script>

<style scoped>

</style>
